<template>
	<orh-table reload @on-reload="refresh" search :searchOption="typelist" :searchOptionSelected="searchOptionSelected" @on-search="searchmt" add="teacher_course_add" del="teacher_course_del" @on-del="prompt = true" pages @on-add="addSilde"
	    :pageDate="pageDate" @on-page-change="Information">
		<Button type="primary" size="small" @click="exportExcel" style="margin-left: 10px" slot="returntosuperior">
	      <Icon type="ios-download-outline" v-button="'teacher_course_export'"></Icon>导出任课数据</Button>
		<Table :data="TeacherList" @on-selection-change="selectOne" highlight-row :columns="columns1" slot="table" ref="currentRowTable" :loading="tableload"></Table>
		<Modal v-model="prompt" title="数据删除" :loading="loading" @on-ok="asyncOK" slot="others">
			<p>{{ cont }}</p>
		</Modal>
		<orh-sidebar v-model="isShow" :title="titles" scale slot="others">
			<component :is="content" :dataId="dataIds" @requery="requery"></component>
		</orh-sidebar>
	</orh-table>
</template>

<script>
	export default {
		name:'teacher-teachercourse',
		components: {
			Operation: resolve => {
				require([
					'./Operation.vue'
				], resolve);
			},
		},
		data() {
			return {
				TeacherList: [],
				prompt: false,
				loading: true,
				tableload: true,
				isShow: false,
				del: '',
				dataIds: '',
				content: '',
				titles: '',
				cont: '您确定要删除这些数据吗',
				pageDate: {
					total: 0,
					current_page: 1,
					per_page: 0
				},
				searchOptionSelected: '1',
				typelist: [{
						value: '1',
						label: '教师'
					},
					{
						value: '2',
						label: '课程'
					}
				],
				extend_filter: {
					type: '',
					searchvalue: ''
				},				
				columns1: [{
						type: 'selection',
						width: 60,
						align: 'center'
					},
					{
						title: '身份证号',
						render: (h, params) => {
							if (params.row.user_name.idcard != null) {
								let idcard = params.row.user_name.idcard;
								return h('div', idcard);
							}
						}
					},
					{
						title: '姓名',
						render: (h, params) => {
							let teacher_name = params.row.user_name.teacher_name.zh?params.row.user_name.teacher_name.zh:params.row.user_name.teacher_name.mn;
							return h('div', teacher_name);							
						}
					},
	
					{
						title: '联系号码',
						render: (h, params) => {
							if (params.row.user_name.telnumber !== null) {
								let telnumber = params.row.user_name.telnumber;
								return h('div', telnumber);
							}
						}
					},
	
					{
						title: '担任课程',
						render: (h, params) => {
							if (params.row.course_name != null) {
								let course_name = params.row.course_name.course_name.zh?params.row.course_name.course_name.zh:params.row.course_name.course_name.mn;
								return h('div', course_name);
							}
						}
					},
					{
						title: '操作',
						key: 'operation',
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h(
									'Button', {
										directives: [{
											name: 'button',
											value: 'teacher_course_edit'
										}],
										props: {
											type: 'primary',
											size: 'small'
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.update(params.row.id);
											}
										}
									},
									'编辑'
								),
								h(
									'Button', {
										directives: [{
											name: 'button',
											value: 'teacher_course_del'
										}],
										props: {
											type: 'error',
											size: 'small'
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.remove(params.row.id);
											}
										}
									},
									'删除'
								),
							]);
						}
					}
				],
				
			};
		},
		methods: {
			//任课列表
			Information(value) {
				this.tableload = true
				let extend_filter = this.extend_filter;
				let url = '';
				for (var i in extend_filter) {
					if (extend_filter[i] != null) {
						url += i + '=' + extend_filter[i] + '&';
					}
				}
				url = url.trim('&');
				this.$http.get('api/teacher/v1/teachercourse/list?page=' + value + '&' + url).then(
					val => {
						this.pageDate.per_page = val.pages.per_page;
						this.pageDate.total = val.pages.total;
						this.pageDate.current_page = val.pages.current_page;
						this.TeacherList = val.data;
						this.pageUrl = val.pages.path;
						this.tableload = false;
					}).catch(err =>{
						this.$Message.error('数据加载失败！')
						this.tableload = false;
					});
			},
			requery(state) {
				if (state == true) {
					this.child = false;
					this.isShow = false;
					this.tableload = true;
					this.Information(this.pageDate.current_page);
				}
			},
			//添加
			addSilde() {
				this.dataIds='';
				this.titles = '添加任课';
				this.isShow = true;
				this.content = 'Operation';
			},
			//修改
			update(index) {
				this.dataIds = index;
				this.titles = '修改任课';
				this.isShow = true;
				this.content = 'Operation';
			},
			//搜索
			searchmt(str, val) {
				this.extend_filter.type = val;
				this.extend_filter.searchvalue = str;
				this.tableload = true;
				this.Information(this.pageDate.current_page);
			},
			//刷新
			refresh() {
				for (var i in this.extend_filter) {
					this.extend_filter[i] = null;
				}
				this.tableload = true;
				this.Information(this.pageDate.current_page);
			},
			//单条删除
			remove(index) {
				this.prompt=true
				this.del = [];
				this.del.push(index);
				
			},
			//批量删除
			selectOne(index) {
				this.del = [];
				index.forEach(item => {
					this.del.push(item.id);
				});
			},
			//删除操作
			asyncOK() {
				this.del = JSON.stringify(this.del);
				this.$http.delete('api/teacher/v1/teachercourse/del/' + this.del).then(
					val => {
						this.$Message.success(this.$t('delete_success'));
						this.prompt = false;
						this.tableload = true;
						this.Information(this.pageDate.current_page);
					
					}).catch(err =>{
						this.$Message.error(this.$t('delete_error'))
						this.prompt = false;
					});
			},
			//导出
			exportExcel() {
				this.$http
					.get('api/teacher/v1/teachercourse/exportExcel')
					.then(val => {
						window.open(val.data.url)	
					});
			},
		},
		mounted() {
			this.Information();
		}
	};
</script>




